<template>
  <a-card title="空间级别介绍">
    <a-typography-paragraph>
      * 目前仅支持开通普通版，如需升级空间，请联系管理员。
    </a-typography-paragraph>
    <a-typography-paragraph v-for="spaceLevel in spaceLevelList">
      {{ spaceLevel.text }}： 大小： {{ formatSize(spaceLevel.maxSize) }}， 数量：
      {{ spaceLevel.maxCount }}
    </a-typography-paragraph>
  </a-card>
</template>

<script setup lang="ts">
import { onMounted, ref } from 'vue'
import { listSpaceLevelUsingGet } from '@/api/spaceController'
import { message } from 'ant-design-vue'
import { formatSize } from '../utils'

const spaceLevelList = ref<API.SpaceLevel[]>([])

// 获取空间级别
const fetchSpaceLevelList = async () => {
  const res = await listSpaceLevelUsingGet()
  if (res.data.code === 0 && res.data.data) {
    spaceLevelList.value = res.data.data
  } else {
    message.error('加载空间级别失败，' + res.data.message)
  }
}

onMounted(() => {
  fetchSpaceLevelList()
})
</script>

<style scoped>

</style>
